<template>
    <div class="errorPage">
        <loginHeader class="errorPageHeader"></loginHeader>
        <div class="errorCenter">
            <div class="ConterWrap">
                <img src="./../../assets/img/pages/404.png" alt="">
                <p class="ConterWrapA">网页走丢了,需要刷新一下</p>
                <p class="ConterWrapB" @click="goBack">刷新一下</p>
            </div>
        </div>
    </div>
</template>

<script>
    import  loginHeader  from "./../login/LoginHeader";
    import  loginFooter  from "./../login/LoginFooter";
    export default {
        name: "404",
        components:{
            loginHeader,
            loginFooter,
        },
        data(){
            return {

            }
        },
        methods: {
            goBack(){
                this.$router.go(-1);
            }
        }
    }
</script>


<style scoped>
    .errorPage{
        position: relative;
    }
    .errorPageHeader{
        position: fixed;
        top: 0;
    }
    .errorCenter{
        width: 100%;
        background: #ffffff;
    }
    .ConterWrap{
        width: 1200px;
        margin: 0 auto;
        text-align: center;
    }
    .ConterWrap img{
        width: 200px;
        height: 185px;
        margin-top: 140px;
    }
    .ConterWrapA{
        font-size:16px;
        font-family:"PingFang-SC-Medium";
        font-weight:500;
        color:rgba(0,0,0,1);
        line-height:50px;
        text-shadow:0px 7px 98px rgba(145,34,0,0.4);
    }
    .ConterWrapB{
        display: inline-block;
        width:138px;
        height:32px;
        line-height: 32px;
        font-size:16px;
        font-family:"PingFang-SC-Bold";
        font-weight:600;
        color:rgba(231,38,27,1);
        border:2px solid rgba(231,38,27,1);
        border-radius:16px;
        text-shadow:0px 7px 98px rgba(145,34,0,0.4);
        cursor: pointer;
        margin-top: 40px;
    }
</style>
